import { useState, useEffect } from 'react'
import { resourcePath } from '../../../../../../../utils/resource';
import { Button, Table } from 'antd';
import useBusinessMap from '../../../../../../common/BusinessMap/useBusinessMap';
import { navByWkt } from '../../../../../../../utils/helper/mapHelper';
import JcyjApi from '../../../../../../../utils/apis/JcyjApi';

export default function Gklwt(props){
    const [datas,setDatas]=useState();
    const [params,setParams]=useState({
        pageSize:5,
        pageNum:1,
        jcdlx:'高空瞭望塔'
    });
    const [total,setTotal]=useState();
    
    useEffect(()=>{
        JcyjApi.jcdList(params).then(resp=>{
            setDatas(resp?.rows);
            setTotal(resp?.total)
        });
    },[params])
   


    const map=useBusinessMap();
    return <div>
        <div style={{
            background:`url(${resourcePath.blockTitleBg})`,
            height: 36,
            backgroundSize: '100% 100%',
            fontSize: 18,
            lineHeight: '36px',
            paddingLeft: 12,
            fontWeight: "bold"
        }}>
            高空瞭望塔(<span>{total}</span>)
        </div>
        <div style={{
            padding:12
        }}> 
            <Table 
            columns={[{
                title:'站点名',
                dataIndex:'zdm',
                ellipsis:true
                
            },
            {
                width:70,
                align:'center',
                render:(text,record)=>{
                    return <Button type="link" size="small" onClick={e=>{
                        if(record.geom){
                            navByWkt(record.geom,map)
                        }
                        props.onDetail?.(record);
                    }}>详情</Button>
            }

        }
    ]}
        dataSource={datas}
        size="small"
        bordered
        // onRow={
        //     record=>{
        //         return {
        //              onClick:e=>{
        //             if(record.shp){
        //                 navByWkt(record.shp,map)
        //             }
        //         }
        //     }   
        // }}
        pagination={{
            current:params.pageNum,
            pageSize:params.pageSize,
            total,
            simple:true,
            onChange:(page)=>{
                setParams(params=>{
                    return {
                        ...params,
                        pageNum:page
                    }

                })
            }
        }}
        />
        </div>
    </div>

}